<!DOCTYPE html>
<html>
<head>
    {include file='public/meta'/}
    <link rel="stylesheet" type="text/css" href="__STATIC_URL__/static/css/setyxhd.css?v=5"/>
    <link rel="stylesheet" type="text/css" href="__STATIC_URL__/static/fonts/css/font-awesome.css?v=3"/>

    <link rel="stylesheet" href="__STATIC_URL__/static/css/bootstrapSwitch.css">
    <link rel="stylesheet" href="__STATIC_URL__/static/css/setcard.css?v=3"/>

    <script src="__STATIC_URL__/static/js/bootstrapSwitch.js"></script>


    <style>
        .ng-scope input {
            width: 232px;
            margin-left: 5px;
            opacity: 1;
        }
        #img{
            opacity: 0;
        }
        .img {
            width: 318px;
            height: 203px;
            display: inline-block;
            background-size: 100%;
        }
        .ng-scope input#blankRadio1,.ng-scope input#blankRadio2  {
            width: 241px;
            height: 16px;
            top: 5px;

        }
    </style>
</head>
<body>
{include file='public/header'/}
<!------------------导航-------------------------->
<section>
    {include file='public/left'/}
    <!--------------------------主要内容区域------------------------------------->
    <div class="content">

        <div class="panel">
            <div class="">
                <!--路径导航-->
                <ol class="breadcrumb">
                    <li>当前位置是&nbsp;:</li>
                    <li><a href="javascript:history.back();">营销工具</a></li>
                    <li><a href="javascript:history.back(-2)">活动营销</a></li>
                    <li>
                        <a href="javascript:history.back(-1)">公众号送券</a>
                    </li>
                    <li class="active">公众号送券设置</li>
                </ol>
                <div>


                    <div class="panel panel-default ng-scope">
                        <form action="" method="post" id="creatcards">
                            <div class="panel-heading">
                                公众号送券设置规则
                            </div>
                            <div class="panel-body">
                                <div class="row">
                                    <div class="col-sm-6">
                                        <div class="form-horizontal" data-layout="horizontal">
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label"><span class="red-xing-rs"></span>标题：</label>
                                                <div class="col-sm-9">
                                                    <input type="hidden" name="id"   value="" >
                                                    <input type="text" name="title" id="title" class="form-control" maxlength="12" required placeholder="" value="" />
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-horizontal" data-layout="horizontal">
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label"><span class="red-xing-rs"></span>关键字：</label>
                                                <div class="col-sm-9">
                                                    <input type="hidden" name="id"   value="" >
                                                    <input type="text" name="msg_key" id="msg_key" class="form-control" maxlength="12" required placeholder="" value="" />
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-horizontal" data-layout="horizontal">
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label"><span class="red-xing-rs"></span>链接：</label>
                                                <div class="col-sm-9">
                                                    <input type="hidden" name="id"   value="" >
                                                    <input type="text" name="link_url" id="link_url" class="form-control"  placeholder="" value="" />
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-horizontal" data-label="开始时间"
                                             data-layout="horizontal">
                                            <div class="form-group">
                                                <label class="col-sm-3  control-label"><span class="red-xing-rs"></span>选择时间：</label>
                                                <div class="col-sm-9">
                                                    <div class=" w60">
                                                        <input type="text" name="times" class="form-control data_ipt" value=""
                                                               placeholder="请选择开始时间-结束时间" disabled id="starttime">


                                                    </div>

                                                    <div class="checkbox checkbox-primary permanent"
                                                         style="left: 41px;top: 4px;display: inline-block;">
                                                        <input type="hidden" name="time_type" value="lasting" id="lasting">
                                                        <input id="permanent_ck" type="checkbox"
                                                               class="autoDelayFlag" checked>
                                                        <label for="permanent_ck">永久有效</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-horizontal" data-layout="horizontal">
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label"><span class="red-xing-rs"></span>每人限领：</label>
                                                <div class="col-sm-9">
                                                    <input type="text" name="limit_num" class="form-control"  required placeholder="" value="" />
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-horizontal" data-layout="horizontal">
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label"><span class="red-xing-rs"></span>发放数量：</label>
                                                <div class="col-sm-9">
                                                    <input type="text" name="num" class="form-control"  required placeholder="" value="" />
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-horizontal" data-layout="horizontal">
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label"><span class="red-xing-rs"></span>选择卡券：</label>
                                                <div class="col-sm-9">
                                                    <div class="radio radio-info radio-inline single prize" >
                                                        <input type="hidden" id="" value="N" name="is_bonus">

                                                        <input type="hidden" id="" value="N" name="is_balance">

                                                        <input type="hidden" id="" value="Y" name="is_cards">

                                                        <input type="hidden" name="give_type" id="give_type" value="">
                                                        <input type="radio" name="give_type" onclick="xzcard(this);" id="blankRadio1" value="1" class="valid" >

                                                        <label for="give_type"> 免费券</label>
                                                    </div>
                                                    <div class="radio radio-info radio-inline single prize" >
                                                        <input type="radio" name="give_type" onclick="xzcard(this);" id="blankRadio2" value="2" >

                                                        <label for="give_type"> 付费券</label>
                                                    </div>

                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-horizontal" data-layout="horizontal" id="freecard" style="display:none;">
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label"></label>

                                                <div class="col-sm-9">
                                                    <select name="free_id" id="" class="form-control">
                                                        <option value="0">请选择</option>
                                                        {volist name="freecard" id="vo"}
                                                        <option   value="{$vo['id']}">{$vo['title']}</option>
                                                        {/volist}
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-horizontal" data-layout="horizontal" id="paycard" style="display:none;">
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label"></label>
                                                <div class="col-sm-9">
                                                    <select name="paycard_id" id="" class="form-control">
                                                        <option value="0">请选择</option>
                                                        {volist name="paycard" id="vo"}
                                                        <option    value="{$vo['id']}">{$vo['title']}</option>
                                                        {/volist}
                                                    </select>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-horizontal" data-layout="horizontal">
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label"><span class="red-xing-rs"></span>图片：</label>
                                                <div class="col-sm-9">
                                                    <img   src="__STATIC_URL__/static/images/commodityImg.png"  alt="商品图片" class="img">
                                                    <div class="ng-scope" style="position: relative;">
                                                        <span class="btn btn-default">上传图片</span>
                                                        <input type="file" id="img" value=""  onchange="upload('img','file')"/>
                                                        <input type="hidden" name="img" id="logopic-upload" required  value="" >

                                                    </div>
                                                    <div class="r-desc ng-binding ng-scope"> 图片建议尺寸：750像素*480像素，格式为.jpg，大小不超过2M.</div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-horizontal" data-layout="horizontal">
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label"><span class="red-xing-rs"></span>描述内容：</label>
                                                <div class="col-sm-9">
                                                    <textarea name="description" id="description" style="width: 423px; padding: 10px;height: 133px;" required class="commodityIntro p_clear" ></textarea>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-horizontal" data-layout="horizontal">
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label"><span class="red-xing-rs"></span>状态：</label>
                                                <div class="col-sm-9">

                                                    <div class="switch" id="give" data-animated="true">
                                                        <input type="checkbox" name="status" value="" id="status" />

                                                    </div>

                                                </div>
                                            </div>
                                        </div>


                                    </div>
                                </div>

                            </div>
                            <div class="panel-footer">
                                <button class="btn btn-success" type="button" onclick="check();">保存</button>
                            </div>
                        </form>
                    </div>

                </div>
            </div>
        </div>
        {include file='public/footer'/}
    </div>
</section>
<script src="__STATIC_URL__/static/laydate/laydate.js"></script>
<script src="__STATIC_URL__/static/js/setyxhd.js?v=2"></script>

<script>

    laydate.render({
        elem: '#starttime',
        type: 'datetime',
        range:'-',

        change: function(value, date,endDate){ //监听日期被切换


        }
    });

</script>
<script>

    function xzcard(){

        var card = $('input:radio:checked').val();
        if(card=='1'){
            $("#give_type").val("1");
            $("#freecard").attr("style","display:block");
            $("#paycard").attr("style","display:none");
            $("#paycard").find("select").val('0');
        };
        if(card=='2'){
            $("#give_type").val("2");
            $("#freecard").find("select").val('0');
            $("#freecard").attr("style","display:none");
            $("#paycard").attr("style","display:block");
        };

    }
</script>
<script>
    function check(){
        var title=$("#title").val();
        var msg_key=$("#msg_key").val();
        var logopic=$("#logopic-upload").val();
        var card = $('input:radio:checked').val();
        var limit_num=$("#limit_num").val();
        var num=$("#num").val();

        var link_url = $('#link_url').val();
        var starttime=$("#starttime").val();
        var description=$("#description").val();

        if(title==""){
            layer.msg('请填写标题！');
            return false;
        }
        if(msg_key==""){
            layer.msg('请填写关键字！');
            return false;
        }
        if(card==""&&link_url==""){
            layer.msg('请选择卡券或填写链接。');
            return false;
        }
        if ($('#permanent_ck').prop("checked")==false) {
            if(starttime==""){
                alert('请选择时间！');
                return false;
            }
        }

        if(limit_num==""){
            layer.msg('请填写每人限领！');
            return false;
        }

        if(num==""){
            layer.msg('请填写发放数量！');
            return false;
        }

        if(logopic==""){
            layer.msg('请上传图片！');
            return false;
        }
        if(description==""){
            layer.msg('请填写描述内容！');
            return false;
        }


        // 校验通过，全部都不相同
        $.ajax({
            url: "{:url('')}",
            type: "post",
            data: $("#creatcards").serialize(),
            success: function (data) {
                console.log(data);
                if(data.code==0){
                    layer.msg(data.message);
                    setTimeout(function(){
                        window.location.href="{:url('marke/clickputcards')}";

                    },1500)
                }else{
                    layer.msg(data.message);
                }
            }
        })

    }

</script>
<script>
    function upload(file, typed) {
        var formData = new FormData();
        formData.append('file', $('#' + file)[0].files[0]);
        formData.append('other', file);
        $.ajax({
            url: "{:url('uploads/upload')}",
            type: 'POST',
            cache: false,
            data: formData,
            processData: false,
            contentType: false,
        }).done(function (res) {
            console.log(res);
            if(res.code=="0"){
                //            左侧预览图背景
                $(".commodityImg").attr("src", res.pic);
//            右侧预览图片
                $(".img").attr("src", res.pic);
//            相应隐藏input传值
                $("#logopic-upload").val(res.pic);
            }else{
                layer.alert(res.message);
            }

            // $("." + file).attr("src", res.savapath).css("display", "block");
            // $(".file-" + file).val(res.other);
            // $("." + typed + "-" + file).val(res.other);
        }).fail(function (res) {
            layer.msg("上传失败")
        });
    };
</script>
<script>
    $("#give").on('switch-change', function (e, data) {
        var $el = $(data.el), value = data.value;
        if(value==true){
            $("#status").val(1);
        }else{
            $("#status").val(0);
        }
    });
</script>
<script>
    function jf(val){
        if(val == '2'){
            $("#iptval").removeClass("hidden");
        }else{
            $("#iptval").addClass("hidden");
        }
    }

</script>
</body>

</html>
